
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                <i class="icon iconfont icon-xin"></i>
                    <div class="name">新</div>
                    <div class="fontclass">.icon-xin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fanhui"></i>
                    <div class="name">返回</div>
                    <div class="fontclass">.icon-fanhui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingwei"></i>
                    <div class="name">定位</div>
                    <div class="fontclass">.icon-dingwei</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gengduo"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-gengduo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fanhui1"></i>
                    <div class="name">返回</div>
                    <div class="fontclass">.icon-fanhui1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mima"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-mima</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tubiao3"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-tubiao3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shezhi"></i>
                    <div class="name">设置</div>
                    <div class="fontclass">.icon-shezhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xingxing"></i>
                    <div class="name">星星</div>
                    <div class="fontclass">.icon-xingxing</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shijian"></i>
                    <div class="name">时间</div>
                    <div class="fontclass">.icon-shijian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-riyongbaihuo"></i>
                    <div class="name">日用百货</div>
                    <div class="fontclass">.icon-riyongbaihuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei1"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche2"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfontsousuo1"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-iconfontsousuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon"></i>
                    <div class="name">手机</div>
                    <div class="fontclass">.icon-icon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-bianji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-guanbi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-delete"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-delete</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi1"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-guanbi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jia"></i>
                    <div class="name">加</div>
                    <div class="fontclass">.icon-jia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qianbao"></i>
                    <div class="name">钱包</div>
                    <div class="fontclass">.icon-qianbao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hongbao"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-hongbao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei2"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shezhi1"></i>
                    <div class="name">设置</div>
                    <div class="fontclass">.icon-shezhi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiaju"></i>
                    <div class="name">家居</div>
                    <div class="fontclass">.icon-jiaju</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche3"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangjiashangpin"></i>
                    <div class="name">上架商品</div>
                    <div class="fontclass">.icon-shangjiashangpin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei21"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei21</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche1"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shouye"></i>
                    <div class="name">首页</div>
                    <div class="fontclass">.icon-shouye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shijian1"></i>
                    <div class="name">时间</div>
                    <div class="fontclass">.icon-shijian1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-peiziiconfont08"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-peiziiconfont08</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiao10"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-xiao10</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jifen"></i>
                    <div class="name">积分</div>
                    <div class="fontclass">.icon-jifen</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xingxing1"></i>
                    <div class="name">星星</div>
                    <div class="fontclass">.icon-xingxing1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hert"></i>
                    <div class="name">心</div>
                    <div class="fontclass">.icon-hert</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuiguo"></i>
                    <div class="name">水果</div>
                    <div class="fontclass">.icon-shuiguo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jifen1"></i>
                    <div class="name">积分</div>
                    <div class="fontclass">.icon-jifen1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mima1"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-mima1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gengduo1"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-gengduo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianshizhekou"></i>
                    <div class="name">限时折扣</div>
                    <div class="fontclass">.icon-xianshizhekou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingwei1"></i>
                    <div class="name">定位</div>
                    <div class="fontclass">.icon-dingwei1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-youjiantou"></i>
                    <div class="name">右箭头</div>
                    <div class="fontclass">.icon-youjiantou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-youjiantou1"></i>
                    <div class="name">右箭头</div>
                    <div class="fontclass">.icon-youjiantou1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon05"></i>
                    <div class="name">推荐</div>
                    <div class="fontclass">.icon-icon05</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche4"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingwei2"></i>
                    <div class="name">定位</div>
                    <div class="fontclass">.icon-dingwei2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon1"></i>
                    <div class="name">绿家居 眼睛</div>
                    <div class="fontclass">.icon-icon1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mima2"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-mima2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jian"></i>
                    <div class="name">减</div>
                    <div class="fontclass">.icon-jian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huikongxin"></i>
                    <div class="name">惠－空心</div>
                    <div class="fontclass">.icon-huikongxin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daifahuo"></i>
                    <div class="name">待发货</div>
                    <div class="fontclass">.icon-daifahuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianshiqianggou"></i>
                    <div class="name">限时抢购</div>
                    <div class="fontclass">.icon-xianshiqianggou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gengduo2"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-gengduo2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shouji"></i>
                    <div class="name">手机</div>
                    <div class="fontclass">.icon-shouji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daifahuo1"></i>
                    <div class="name">待发货</div>
                    <div class="fontclass">.icon-daifahuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shirt"></i>
                    <div class="name">衣服</div>
                    <div class="fontclass">.icon-shirt</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-apple"></i>
                    <div class="name">食物</div>
                    <div class="fontclass">.icon-apple</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiaoxi"></i>
                    <div class="name">消息</div>
                    <div class="fontclass">.icon-xiaoxi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wode"></i>
                    <div class="name">我的</div>
                    <div class="fontclass">.icon-wode</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-redbag"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-redbag</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-liwu"></i>
                    <div class="name">礼物</div>
                    <div class="fontclass">.icon-liwu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfontshangchuanmoban"></i>
                    <div class="name">客服</div>
                    <div class="fontclass">.icon-iconfontshangchuanmoban</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiaoxi1"></i>
                    <div class="name">消息</div>
                    <div class="fontclass">.icon-xiaoxi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jifen2"></i>
                    <div class="name">积分</div>
                    <div class="fontclass">.icon-jifen2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-feichangmanyi"></i>
                    <div class="name">非常满意</div>
                    <div class="fontclass">.icon-feichangmanyi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lnicon10"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-lnicon10</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhijiang"></i>
                    <div class="name">直降</div>
                    <div class="fontclass">.icon-zhijiang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu1"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-nav-set-team"></i>
                    <div class="name">团队管理</div>
                    <div class="fontclass">.icon-nav-set-team</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-ren"></i>
                    <div class="name">人</div>
                    <div class="fontclass">.icon-ren</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-change"></i>
                    <div class="name">换货</div>
                    <div class="fontclass">.icon-change</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-baihuo"></i>
                    <div class="name">百货</div>
                    <div class="fontclass">.icon-baihuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuijian"></i>
                    <div class="name">推荐</div>
                    <div class="fontclass">.icon-tuijian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuihuanhuoguize"></i>
                    <div class="name">退换货规则</div>
                    <div class="fontclass">.icon-tuihuanhuoguize</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianshiqianggou1"></i>
                    <div class="name">限时抢购</div>
                    <div class="fontclass">.icon-xianshiqianggou1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu2"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei3"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-ziying"></i>
                    <div class="name">自营</div>
                    <div class="fontclass">.icon-ziying</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xinshixin"></i>
                    <div class="name">心－实心</div>
                    <div class="fontclass">.icon-xinshixin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-my-hongbao-yuan"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-my-hongbao-yuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-edit-copy"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-edit-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xin2"></i>
                    <div class="name">心2</div>
                    <div class="fontclass">.icon-xin2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan1"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingwei3"></i>
                    <div class="name">定位</div>
                    <div class="fontclass">.icon-dingwei3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lirunbiao"></i>
                    <div class="name">利润表</div>
                    <div class="fontclass">.icon-lirunbiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lirunbiao1"></i>
                    <div class="name">利润表</div>
                    <div class="fontclass">.icon-lirunbiao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfont"></i>
                    <div class="name">返利</div>
                    <div class="fontclass">.icon-iconfont</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfont1"></i>
                    <div class="name">消息</div>
                    <div class="fontclass">.icon-iconfont1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kefu"></i>
                    <div class="name">客服</div>
                    <div class="fontclass">.icon-kefu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei11"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangpin"></i>
                    <div class="name">商品</div>
                    <div class="fontclass">.icon-shangpin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-phone"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-phone</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei5"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei5</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfonthuo"></i>
                    <div class="name">iconfont-货</div>
                    <div class="fontclass">.icon-iconfonthuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfonthuo1"></i>
                    <div class="name">iconfont-货</div>
                    <div class="fontclass">.icon-iconfonthuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-more"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-more</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huiyuan"></i>
                    <div class="name">会员</div>
                    <div class="fontclass">.icon-huiyuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tanhao"></i>
                    <div class="name">叹号</div>
                    <div class="fontclass">.icon-tanhao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiao"></i>
                    <div class="name">分销</div>
                    <div class="fontclass">.icon-fenxiao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-pinpai"></i>
                    <div class="name">品牌</div>
                    <div class="fontclass">.icon-pinpai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gengduo3"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.icon-gengduo3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shihui"></i>
                    <div class="name">实惠</div>
                    <div class="fontclass">.icon-shihui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tousu"></i>
                    <div class="name">投诉</div>
                    <div class="fontclass">.icon-tousu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wode1"></i>
                    <div class="name">我的</div>
                    <div class="fontclass">.icon-wode1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jian1"></i>
                    <div class="name">减</div>
                    <div class="fontclass">.icon-jian1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan11"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfont0082"></i>
                    <div class="name">返利</div>
                    <div class="fontclass">.icon-iconfont0082</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wode2"></i>
                    <div class="name">我的</div>
                    <div class="fontclass">.icon-wode2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-miaoshaicon"></i>
                    <div class="name">限时icon</div>
                    <div class="fontclass">.icon-miaoshaicon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-taoxin2"></i>
                    <div class="name">桃心2</div>
                    <div class="fontclass">.icon-taoxin2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huidingbu"></i>
                    <div class="name">回顶部</div>
                    <div class="fontclass">.icon-huidingbu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bao"></i>
                    <div class="name">包</div>
                    <div class="fontclass">.icon-bao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-baihuo1"></i>
                    <div class="name">百货</div>
                    <div class="fontclass">.icon-baihuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qianbao1"></i>
                    <div class="name">钱包</div>
                    <div class="fontclass">.icon-qianbao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-pinpai1"></i>
                    <div class="name">品牌</div>
                    <div class="fontclass">.icon-pinpai1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jifenzhang"></i>
                    <div class="name">积分</div>
                    <div class="fontclass">.icon-jifenzhang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu11"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jia1"></i>
                    <div class="name">加</div>
                    <div class="fontclass">.icon-jia1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan2"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kefu1"></i>
                    <div class="name">客服</div>
                    <div class="fontclass">.icon-kefu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenlei4"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-fenlei4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan3"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xihu"></i>
                    <div class="name">洗护</div>
                    <div class="fontclass">.icon-xihu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu3"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-pingjia"></i>
                    <div class="name">评价</div>
                    <div class="fontclass">.icon-pingjia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu4"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon04"></i>
                    <div class="name">分类</div>
                    <div class="fontclass">.icon-icon04</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-aixin2"></i>
                    <div class="name">爱心2</div>
                    <div class="fontclass">.icon-aixin2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan4"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon2"></i>
                    <div class="name">下箭头</div>
                    <div class="fontclass">.icon-icon2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiangxu"></i>
                    <div class="name">降序</div>
                    <div class="fontclass">.icon-jiangxu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daifahuo2"></i>
                    <div class="name">待发货</div>
                    <div class="fontclass">.icon-daifahuo2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shoucang3"></i>
                    <div class="name">心-实心</div>
                    <div class="fontclass">.icon-shoucang3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu21"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu21</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan5"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan5</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huiyuan-copy"></i>
                    <div class="name">会员</div>
                    <div class="fontclass">.icon-huiyuan-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon-yxj-complaint"></i>
                    <div class="name">投诉</div>
                    <div class="fontclass">.icon-icon-yxj-complaint</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lirunbiao2"></i>
                    <div class="name">利润表</div>
                    <div class="fontclass">.icon-lirunbiao2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenpei"></i>
                    <div class="name">分配</div>
                    <div class="fontclass">.icon-fenpei</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huiyuan1"></i>
                    <div class="name">会员</div>
                    <div class="fontclass">.icon-huiyuan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hongbao1"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-hongbao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fanhuidingbu"></i>
                    <div class="name">返回顶部</div>
                    <div class="fontclass">.icon-fanhuidingbu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche11"></i>
                    <div class="name">评价</div>
                    <div class="fontclass">.icon-gouwuche11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bao1"></i>
                    <div class="name">包</div>
                    <div class="fontclass">.icon-bao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tubiao208"></i>
                    <div class="name">投诉</div>
                    <div class="fontclass">.icon-tubiao208</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huanhuobaozhang"></i>
                    <div class="name">换货保障，</div>
                    <div class="fontclass">.icon-huanhuobaozhang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kefu2"></i>
                    <div class="name">客服</div>
                    <div class="fontclass">.icon-kefu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jifen21"></i>
                    <div class="name">积分</div>
                    <div class="fontclass">.icon-jifen21</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuandui"></i>
                    <div class="name">团队</div>
                    <div class="fontclass">.icon-tuandui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gouwuche5"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.icon-gouwuche5</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-7shuiguo"></i>
                    <div class="name">水果</div>
                    <div class="fontclass">.icon-7shuiguo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuandui1"></i>
                    <div class="name">团队</div>
                    <div class="fontclass">.icon-tuandui1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu5"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu5</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wode3"></i>
                    <div class="name">我的</div>
                    <div class="fontclass">.icon-wode3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianpu111"></i>
                    <div class="name">店铺</div>
                    <div class="fontclass">.icon-dianpu111</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenpeidizhi"></i>
                    <div class="name">分配地址</div>
                    <div class="fontclass">.icon-fenpeidizhi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu"></i>
                    <div class="name">同意</div>
                    <div class="fontclass">.icon-shanchu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tubiao208-copy"></i>
                    <div class="name">投诉</div>
                    <div class="fontclass">.icon-tubiao208-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huiyuan2"></i>
                    <div class="name">会员</div>
                    <div class="fontclass">.icon-huiyuan2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wode4"></i>
                    <div class="name">我的</div>
                    <div class="fontclass">.icon-wode4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-index-copy"></i>
                    <div class="name">首页-首页</div>
                    <div class="fontclass">.icon-index-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-baojian"></i>
                    <div class="name">保健</div>
                    <div class="fontclass">.icon-baojian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-pinpai2"></i>
                    <div class="name">品牌</div>
                    <div class="fontclass">.icon-pinpai2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xihuan"></i>
                    <div class="name">喜欢</div>
                    <div class="fontclass">.icon-xihuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xuanzehuanhuo"></i>
                    <div class="name">选择换货</div>
                    <div class="fontclass">.icon-xuanzehuanhuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tousu-copy"></i>
                    <div class="name">投诉</div>
                    <div class="fontclass">.icon-tousu-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jushihui"></i>
                    <div class="name">聚实惠</div>
                    <div class="fontclass">.icon-jushihui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-manyidu"></i>
                    <div class="name">满意度</div>
                    <div class="fontclass">.icon-manyidu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan21"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan21</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang"></i>
                    <div class="name">资源分配</div>
                    <div class="fontclass">.icon-fenxiang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiajubaihuo"></i>
                    <div class="name">家居百货</div>
                    <div class="fontclass">.icon-jiajubaihuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuihuanhuo"></i>
                    <div class="name">退换货</div>
                    <div class="fontclass">.icon-tuihuanhuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenpei1"></i>
                    <div class="name">分配</div>
                    <div class="fontclass">.icon-fenpei1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-maoli-"></i>
                    <div class="name">毛利-01</div>
                    <div class="fontclass">.icon-maoli-</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xihuan1"></i>
                    <div class="name">喜欢</div>
                    <div class="fontclass">.icon-xihuan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tousu-yuankuang"></i>
                    <div class="name">投诉-圆框</div>
                    <div class="fontclass">.icon-tousu-yuankuang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-baozhuangsheji"></i>
                    <div class="name">包装设计</div>
                    <div class="fontclass">.icon-baozhuangsheji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo1"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dingdan31"></i>
                    <div class="name">订单</div>
                    <div class="fontclass">.icon-dingdan31</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shubaotianchong"></i>
                    <div class="name">书包 填充</div>
                    <div class="fontclass">.icon-shubaotianchong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-arrow-down"></i>
                    <div class="name">下箭头</div>
                    <div class="fontclass">.icon-arrow-down</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuxieliuyan"></i>
                    <div class="name">书写留言2</div>
                    <div class="fontclass">.icon-shuxieliuyan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lingdai_tie"></i>
                    <div class="name">领带_tie3</div>
                    <div class="fontclass">.icon-lingdai_tie</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo2"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuxie"></i>
                    <div class="name">书写</div>
                    <div class="fontclass">.icon-shuxie</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jibenxinxi"></i>
                    <div class="name">基本信息</div>
                    <div class="fontclass">.icon-jibenxinxi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-down"></i>
                    <div class="name">下箭头</div>
                    <div class="fontclass">.icon-down</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon3"></i>
                    <div class="name">下箭头</div>
                    <div class="fontclass">.icon-icon3</div>
                </li>
            
        </ul>

        <h2 id="font-class-">font-class引用</h2>
        <hr>

        <p>font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。</p>
        <p>与unicode使用方式相比，具有如下特点：</p>
        <ul>
        <li>兼容性良好，支持ie8+，及所有现代浏览器。</li>
        <li>相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。</li>
        <li>因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。</li>
        <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的fontclass代码：</h3>


        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;link rel="stylesheet" type="text/css" href="./iconfont.css"&gt;</span></code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-css hljs">&lt;<span class="hljs-selector-tag">i</span> <span class="hljs-selector-tag">class</span>="<span class="hljs-selector-tag">iconfont</span> <span class="hljs-selector-tag">icon-xxx</span>"&gt;&lt;/<span class="hljs-selector-tag">i</span>&gt;</code></pre>
        <blockquote>
        <p>"iconfont"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。</p>
        </blockquote>
    </div>
</body>
</html>
